<template>
	<div class="box">
    <keep-alive>
      <router-view :key='key'></router-view>
    </keep-alive>
		
		<v-navbar :items="items" :showIconOrSrc="showIconOrSrc" :idx="idx" @change="change"></v-navbar>
	</div>
</template>

<script>
import NavBar from "@/components/navbar/component/index.vue";
import {items} from "@/common/items.js";
export default {
  name: "navbar",
  inject:['reload'],
  created() {
    console.log(items);
  },
  data() {
    return {
      idx: 0,
      showIconOrSrc: false,
      items,
    };
  },
  computed:{
	    key(){
	        return this.$route.path + Math.random();
	    }
	},
  components: {
    "v-navbar": NavBar
  },
  methods: {
    change(index) {
      if(index===0) {
        this.refresh();
      }
      let self = this;
      self.idx = index;
      console.log("index===>", index);
      self.$router.push({
          name: self.items[index].push
      });
    },
    refresh() {
      this.reload();
    }
  }
};
</script>

<style scoped>
.box {
  width: 100%;
  height: 100%;
}
</style>